/**循环事件绑定问题 */

import React from 'react'

class DemoSix extends React.Component {
  state = {
    arr: [
      { title: '苹果', id: 1 },
      { title: '香蕉', id: 2 },
      { title: '梨', id: 3 },
    ]
  }

  handleClick(options) {
    console.log('标题: ', options.title)
  }

  render() {
    let { arr } = this.state
    return <>
      {arr.map(item => {
        return <span
          style={{ margin: 10, padding: 8, display: 'inline-block', border: '1px solid #ccc' }}
          // 循环事件绑定
          onClick={this.handleClick.bind(this, item)}
          key={item.id}
        >{item.title}</span>
      })}
    </>
  }
}

export default DemoSix